<template>
  <div class="game_container">
    <div class="name">
      <h1>普法小游戏</h1>
      <h4>智能机器人</h4>
      <img src="../assets/image/game_img_1@2x.png" alt="">
    </div>

    <van-grid :border="false" :column-num="2" class="gameIcon">
      <van-grid-item @click="gameEnter(item.id)" v-for="(item,index) in list" :key="index">
        <img :src="item.imgSrc">
      </van-grid-item>

    </van-grid>

  </div>
</template>
<script>
export default {
  name: 'App',
  data () {
    return {
      list: [
        {
          id: 1,
          imgSrc: 'https://cdn2.pluslegal.cn/faku/game_icon_1%402x.png'

        },
        {
          id: 2,
          imgSrc: 'https://cdn2.pluslegal.cn/faku/game_icon_2%402x.png'

        },
        {
          id: 3,
          imgSrc: 'https://cdn2.pluslegal.cn/faku/game_icon_3%402x.png'

        },
        {
          id: 4,
          imgSrc: 'https://cdn2.pluslegal.cn/faku/game_icon_4%402x.png'

        }
      ],
    };
  },

  mounted () {


  },
  methods: {

    gameEnter: function (id) {
      console.log(id)
      if (id == 1) {
        this.$router.push({ name: 'throughGameHome' })
      } else if (id == 2) {
        this.$router.push({ name: 'garden', query: { firstId: id, title: this.name3 } })
      } else if (id == 3) {
        this.$router.push({ name: 'garden', query: { firstId: id, title: this.name3 } })
      } else {
        this.$router.push({ name: 'garden', query: { firstId: id, title: this.name3 } })
      }

    },


  }
}
</script>